<html><head>
<link href="options.css" rel="stylesheet" type="text/css"/>
<script src="tools.js"></script>
<script src="prefs.js"></script>
<script src="fetchers.js"></script>
<script type="text/javascript">
function init() {
  SeoprofesionalTools.translate();
  document.getElementById("about_url").href = chrome.i18n.getMessage("about_url");
  var i;
  var html = "";
  for (i = 0; i<SeoprofesionalFetchers.length;i++) {
      var f = SeoprofesionalFetchers[i];
      html+= "<h2>" + f.nicename + "</h2>";
      html+= "<input type='checkbox' id='" + f.name + "' ";
      if (f.enabled) html+= " checked ";
      html+= "/>" + chrome.i18n.getMessage("enabled") + " &nbsp; &nbsp; &nbsp; ";
      html+= "<input type='radio' name='prefered' id='" + f.name + ".prefered'";
      if (f.prefered) html+= " checked ";
      html+= "/>" + chrome.i18n.getMessage("preferred") + " &nbsp; &nbsp; &nbsp;  &nbsp; &nbsp; &nbsp; ";
      html+= chrome.i18n.getMessage("refresh_after");
      html+= " <input id='" + f.name + ".refresh' value='" + f.refresh + "'/> ";
      html+= chrome.i18n.getMessage("refresh_after_days") + "<br>";
  }
  document.getElementById("fetchers").innerHTML = html;

  mkMenuLinksTable(prefsGetJSON("menulinks", SeoprofesionalTools.default_menulinks));

  document.getElementById("enabled").checked = prefsGetBool("enabled", true);
  document.getElementById("specbadge").checked = prefsGetBool("specbadge", false);
}
function mkMenuLinksTable(menulinks) {
  document.getElementById("menulinks").innerHTML = "";
  var table = document.createElement("table");
  table.id = "menulinkstable";
  var el, x;
  var count = 1;
  table.insertRow(0);
  el = table.rows[0].insertCell(0);
  el.innerText = chrome.i18n.getMessage("enabled");
  el = table.rows[0].insertCell(1);
  el.innerText = chrome.i18n.getMessage("name");
  el = table.rows[0].insertCell(2);
  el.innerText = chrome.i18n.getMessage("url");
  el = table.rows[0].insertCell(3);
  for (i = 0;i<menulinks.length;i++) {
    table.insertRow(count++);
    var ml = menulinks[i];
    x = document.createElement("input");
    x.type = "checkbox";
    x.id = x.name = "__ml_e_" + i;
    x.checked = ml[0];
    el = table.rows[count-1].insertCell(0);
    el.appendChild(x);
    if (ml[3]) {
      el = table.rows[count-1].insertCell(1);
      el.id = "__ml_in_" + i;
      el.innerText = ml[1];
      el = table.rows[count-1].insertCell(2);
      el.id = "__ml_it_" + i;
      el.innerText = ml[2];
    } else {
      x = document.createElement("input");
      x.value = ml[1];
      x.size = 30;
      x.id = "__ml_n_" + i;
      el = table.rows[count-1].insertCell(1);
      el.appendChild(x);
      x = document.createElement("input");
      x.value = ml[2];
      x.size = 120;
      x.id = "__ml_t_" + i;
      x.title = chrome.i18n.getMessage("menulinks_template_help");
      el = table.rows[count-1].insertCell(2);
      el.appendChild(x);
    }
  }
  document.getElementById("menulinks").appendChild(table);
}
function addMLRow() {
  var table = document.getElementById("menulinkstable");
  var i = table.rows.length;
  var count = i-1;
  var x = document.createElement("input");
  table.insertRow(i);
  x.type = "checkbox";
  x.id = x.name = "__ml_e_" + count;
  x.checked = true;
  el = table.rows[i].insertCell(0);
  el.appendChild(x);
  x = document.createElement("input");
  x.value = "";
  x.id = x.name = "__ml_n_" + count;
  x.size = 30;
  el = table.rows[i].insertCell(1);
  el.appendChild(x);
  x = document.createElement("input");
  x.value = "";
  x.id = x.name = "__ml_t_" + count;
  x.title = chrome.i18n.getMessage("menulinks_template_help");
  x.size = 120;
  el = table.rows[i].insertCell(2);
  el.appendChild(x);
}
function resetML() {
  var menulinks = prefsGetJSON("menulinks", SeoprofesionalTools.default_menulinks);
  var out = [];
  //shallow copy, is that alright?
  for (var i = 0;i<SeoprofesionalTools.default_menulinks.length;i++) {
    out.push(SeoprofesionalTools.default_menulinks[i]);
  }
  for (var i = 0;i<menulinks.length;i++) {
    if (!menulinks[i][3]) {
      out.push(menulinks[i]);
    }
  }
  mkMenuLinksTable(out);
}
function saveOptions() {
  var i;
  var el;
  var inputs = document.getElementsByTagName("input");
  for (i = 0;i<inputs.length;i++) {
      el = inputs[i];
      if (0==el.id.indexOf("__")) {  // skipping special tags
        continue;
      }
      if ("checkbox"==el.type || "radio"==el.type) {
          prefsSet(el.id, el.checked);
      } else {
          prefsSet(el.id, el.value);
      }
  }
  var ml = [];
  var enabled = false;
  var builtin = false;
  var name = "";
  var templ = "";
  // Get menulinks
  for(i = 0;;i++) {
    el = document.getElementById("__ml_e_"+i);
    if (!el) break;
    enabled = el.checked;
    el = document.getElementById("__ml_in_"+i);
    if (el) {
      name = el.innerText;
      templ = document.getElementById("__ml_it_"+i).innerText;
      builtin = true;
    } else {
      name = document.getElementById("__ml_n_"+i).value;
      templ = document.getElementById("__ml_t_"+i).value;
      builtin = false;
    }
    if (""!=name && ""!=templ) {
      ml.push([enabled, name, templ, builtin]);
    }
  }
  prefsSetJSON("menulinks", ml);
  // Update status to let user know options were saved.
  var status = document.getElementById("status");
  status.innerHTML = chrome.i18n.getMessage("options_saved"); ;
  setTimeout(function() { status.innerHTML = ""; }, 750);
}
</script>
</head><body onload="init()">
<h1 class="trans">seop_options</h1>
<div id="main">
  <input type="checkbox" id="enabled"><span class="trans">seop_enabled</span><br>
  <div id="fetchers">
  </div>
  <br>
  <input type="checkbox" id="specbadge"><span class="trans">specbadge</span><br>
  <h2 class="trans">menulinks_head</h2>
  <div id="menulinks">
  </div>
  <table style="display: inline;">
    <tr onclick="addMLRow()">
      <td><img src="plus.jpg"></td>
      <td style="vertical-align:bottom;"><span class="trans">add_link</span></td>
    </tr>
  </table>
  <table style="display: inline;">
    <tr onclick="resetML()">
      <td><img src="reload.png"></td>
      <td style="vertical-align:bottom;"><span class="trans">reset_menulinks</span></td>
    </tr>
  </table>
  <br>
  <br>
  <button onclick="saveOptions()" class="trans">save</button>
  <span id="status"></span>

</div>
<div id="footer">
<table>
<tr>
<td><a id="about_url" href="about.html" class="trans">about</a></td>
<td> | </td>
<td><a href="license.html" class="trans">license</a></td></tr>
</table>
</div>
</body></html>

